<template>
  <div class="container">
    <!-- 导航栏部分 -->
    <el-menu class="el-menu-demo" mode="horizontal" background-color="#545c64" text-color="#fff">
      <el-menu-item index="1" class="nav" @click="main_header()">首页</el-menu-item>
      <el-menu-item index="2" class="nav" @click="main_studyCenter()">学习中心</el-menu-item>
      <el-menu-item index="3" class="nav" @click="main_shop()">商城中心</el-menu-item>
      <el-menu-item index="4" class="nav" @click="main_personal()">个人中心</el-menu-item>
      <el-menu-item index="5" class="nav" @click="main_ammucation()">互动中心</el-menu-item>
      <el-menu-item index="6" class="nav" @click="main_applicationCenter()">招聘中心</el-menu-item>
    </el-menu>
  </div>
</template>

<script>

export default {
  name: 'navs',
  components: {

  },
  methods: {
    main_header() {
      this.$router.push('/main');
    },
    main_studyCenter() {
      this.$router.push('/study_center');
    },
    main_ammucation() {
      this.$router.push('/ammucation');
    },
    main_personal() {
      this.$router.push('/personal');
    },
    main_applicationCenter() {
      this.$router.push('/application_center');
    },
    main_shop() {
      this.$router.push('/shop');
    }
  }
}
</script>

<style scoped>
a {
  text-decoration: none;
}

.nav {
  margin-left: 100px;
}
</style>
